<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"> 
	<head>
		<title></title>
	</head>
	<body>
		<div id="contentContainer" width="100%" height="100%" style="margin: 15px;">

			<div th:replace="fragment/admin_content_query_form"></div>
			 
			<!-- 按钮 -->
		 	<div style="margin-bottom: 10px;margin-top: 20px;">
				<Button-group>
					<i-button type="ghost"  v-on:click="doAddButton()"><Icon type="ios-download-outline"></Icon> 新增</i-button>
					<i-button type="ghost"  v-on:click="doUpdateButton()"><Icon type="ios-download-outline"></Icon> 修改</i-button>
					<i-button type="ghost"  v-on:click="doDeleteButton()"><Icon type="ios-download-outline"></Icon> 删除</i-button>
				</Button-group>
				<i-switch v-model="isOpen" size="large" v-on:on-change="turnFilter">
				    <span slot="open">过滤</span>
				    <span slot="close">关闭</span>
				</i-switch>
			</div>

			<div th:replace="fragment/admin_content_table"></div>

			<!-- 新增 -->
			<Modal
				width="600"
				v-model="vueAddModalVisible"
				:styles="{top: '80px'}"
				title="增加敏感词">

				<i-form ref="vueAddForm" :model="vueAddForm" :rules="vueAddFormRules" :label-width="80">
					<Form-item prop="id" v-show="false">
						<i-input v-model="vueAddForm.id"></i-input>
					</Form-item>
					<Form-item label="敏感词" prop="word">
						<i-input v-model="vueAddForm.word" placeholder="请输入敏感词"></i-input>
					</Form-item>
					<Form-item label="替换词" prop="replacement">
						<i-input v-model="vueAddForm.replacement" placeholder="请输入替换词"></i-input>
					</Form-item>
					<Form-item label="是否正则表达式" prop="regular">
					    <i-switch v-model="vueAddForm.regular" size="large">
					        <span slot="open">是</span>
					        <span slot="close">否</span>
					    </i-switch>
					</Form-item>
			        <Form-item label="可用状态" prop="available">
					    <i-switch v-model="vueAddForm.available" size="large">
					        <span slot="open">启用</span>
					        <span slot="close">弃用</span>
					    </i-switch>
					</Form-item>
				</i-form>
				<!-- 自定义 modal 底部按钮 -->
				<div slot="footer">
			     	<i-button type="primary"  v-on:click="submitAddForm()">提交</i-button>
		            <i-button type="primary"  v-on:click="resetVueFormData('vueAddForm')"  style="margin-left: 8px">重置</i-button>
		            <i-button type="primary"  v-on:click="vueAddModalVisible = false"  style="margin-left: 8px">取消</i-button>
		        </div>
			</Modal>

			<!-- 修改 -->
			<Modal
				width="600"
				v-model="vueUpdateModalVisible"
				:styles="{top: '50px'}"
				title="修改敏感词">

				<i-form ref="vueUpdateForm" :model="vueUpdateForm" :rules="vueUpdateFormRules" :label-width="80">
					<Form-item prop="id" v-show="false">
						<i-input v-model="vueUpdateForm.id"></i-input>
					</Form-item>
					<Form-item label="敏感词" prop="word">
						<i-input v-model="vueUpdateForm.word" placeholder="请输入敏感词"></i-input>
					</Form-item>
					<Form-item label="替换词" prop="replacement">
						<i-input v-model="vueUpdateForm.replacement" placeholder="请输入替换词"></i-input>
					</Form-item>
					<Form-item label="是否正则表达式" prop="regular">
					    <i-switch v-model="vueUpdateForm.regular" size="large">
					        <span slot="open">是</span>
					        <span slot="close">否</span>
					    </i-switch>
					</Form-item>
			        <Form-item label="可用状态" prop="available">
					    <i-switch v-model="vueUpdateForm.available" size="large">
					        <span slot="open">启用</span>
					        <span slot="close">弃用</span>
					    </i-switch>
					</Form-item>			    	
				</i-form>
				<!-- 自定义 modal 底部按钮 -->
				<div slot="footer">
			     	<i-button type="primary"  v-on:click="submitUpdateForm()">提交</i-button>
		            <i-button type="primary"  v-on:click="vueUpdateModalVisible = false"  style="margin-left: 8px">取消</i-button>
		        </div>
			</Modal>

			<div th:replace="fragment/admin_content_delete_modal"></div>
			<Back-top />
		</div>
		<div th:replace="fragment/admin_content_scripts"></div>
		<script th:src="@{/static/js/business/sensitive-word-biz.js}"></script>
	</body>
</html>
